<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="../css/swiper-4.3.5.min.css">
    <link rel="stylesheet" href="../css/element.css">
    <link rel="stylesheet" href="../css/main.css">
    <link rel="stylesheet" href="../css/person_center/person_center.css">
    <title>会员中心-首页</title>
</head>

<body>
    <div id="app" v-cloak>
        <headers></headers>
        <!-- search -->
        <div class="search wrap">
            <logo></logo>
            <div class="header_tit fl"></div>
            <searchs></searchs>

            <car_box></car_box>

        </div>
        <div class="wrap person_center">
            <!-- nav -->
            <div class="nav_box fl">
                <div id="subapp" v-cloak>
                    <div class="person_nav fl">
                        <ul>
                            <li class="active">首页</li>
                            <li @click='person_center'>我的订单</li>
                            <li @click='person_address'>收货地址</li>
                            <li @click='person_exchange_page'>积分换货</li>
                            <li @click='person_integral'>积分订单</li>
                            <li @click='person_collection'>我的收藏</li>
                            <li @click='person_foot'>浏览足迹</li>
                            <li @click='person_ticket'>优惠券</li>
                            <li @click='person_info'>个人设置</li>
                            <li @click='person_message'>消息中心</li>
                        </ul>
                    </div>
                </div>
            </div>

            <!-- person_info -->
            <div class="right_box fl">
                <div class="person_info">
                    <div class="info_img fl">
                        <img :src="info.viaUrl" alt="">
                    </div>
                    <div class="info_name fl">{{info.nickname}}</div>
                    <div class="info_vip fl cursor" @click='person_index'  v-if="object.memberLevel==null">
                        <div class="icon_vip fl">
                            <img src="../images/icon_v_16.png" alt="">
                        </div>
                        <div class="icon_name fl">普通用户</div>
                    </div>
                    <div class="info_vip fl cursor" @click='person_index'  v-else-if="object.memberLevel==1">
                        <div class="icon_vip fl">
                            <img src="../images/icon_v1_16.png" alt="">
                        </div>
                        <div class="icon_name fl">会员</div>
                    </div>
                    <div class="info_vip fl cursor" @click='person_index'  v-if="object.memberLevel==2">
                        <div class="icon_vip fl">
                            <img src="../images/icon_v2_16.png" alt="">
                        </div>
                        <div class="icon_name fl">会员</div>
                    </div>
                    <div class="info_vip fl cursor" @click='person_index'  v-if="object.memberLevel==3">
                        <div class="icon_vip fl">
                            <img src="../images/icon_v3_16.png" alt="">
                        </div>
                        <div class="icon_name fl">会员</div>
                    </div>
                    <div class="fl integral_box">
                        <span class="integral_tit">我的积分</span>
                        <span class="integral_num">{{integral}}</span>
                    </div>

                    <div class="add_ticket fr">
                        <span class="add cursor" @click='person_address'>我的收货地址</span>
                        <span class="ticket cursor" @click='person_ticket'>我的优惠券</span>
                    </div>
                </div>


                <div class="order_wrap fl">
                    <div class="fl my_roder">
                        <div class="roder_tit">我的订单</div>


                        <div class="order_icon">
                            <ul>
                                <li class="icon_item" v-for='item in nav' @click='center(item.value)'>
                                    <img :src="item.src" alt="">
                                    {{item.text}}
                                </li>
                            </ul>
                        </div>

                        <div class="order_img">
                            <div class="img_item" v-for='(item,index) in info_list'>
                                <div class="clear_both" v-for='(items,index) in item.goodsList'>
                                    <div class="order_img_box fl">
                                        <img :src="items.goodsImgs" alt="">
                                    </div>
                                    <div class="order_text fl">
                                        <p class="order_tit">
                                            {{items.goodsName}}
                                        </p>
                                        <div class="sub_tit">
                                            <span class="order_time">{{items.createTime}}</span>
                                            <!-- <span class="order_detail">物流明细</span> -->
                                        </div>
                                    </div>
                                    <!-- <div class="order_btn fr">
                                        确认收货
                                    </div> -->
                                </div>
                            </div>
                        </div>
                        <div class="integral_page">
                            <el-pagination background layout="prev, pager, next" @current-change="handleCurrentChange"   :page-size='10' :total="total" class="page_list">
                            </el-pagination>
                        </div>
                    </div>


                    <div class="footprint fl">
                        <div class="footprint_tit">
                            <span class="foot_tit">浏览足迹</span>
                            <span class="sub_foot_tit fr cursor" @click='person_foot'>更多 &gt;</span>
                        </div>

                        <div class="footprint_list">
                            <div class="footprint_item fl" v-for='(item,index) in spuList'>
                                <div class="footprint_img cursor" @click='detail(item.id)'>
                                    <img :src="item.coverImg" alt="">
                                </div>
                                <p class="footprint_img_tit">{{item.spuName}}</p>
                                <p class="footprint_money">￥{{item.showPrice}}</p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>





        <div class="wrap clear_both">
           <div class="wrap clear_both">             <productfooter></productfooter>         </div>
        </div>
    </div>
     
    <script src="../js/axios.js"></script>         <script src="../js/qs.js"></script>
    <script src="../js/swiper-4.3.5.min.js"></script>
    <script src="../js/browser.min.js"></script>
    <script src="../js/vue.js"></script>
    <script src="../js/element.js"></script>
    <script src="../js/main.js"></script>
    <script type="text/babel">
        var app = new Vue({
            el: '#app',
            data() {
                return {
                    seckill_swiper_btn:true,
                    car_active:false,
                    groups:3,
                    popup:false,
                    integral:'',
                    spuList:'',
                    total:1,
                    info_list:'',
                    info:'',
                    object:'',
                    nav:[{
                        text:'待付款',
                        src:'../images/icon_daifu.png',
                        value:1
                    },{
                        text:'待发货',
                        src:'../images/icon_daifa.png',
                        value:2
                    },{
                        text:'待收货',
                        src:'../images/icon_daishou.png',
                        value:3
                    },{
                        text:'待评价',
                        src:'../images/icon_daiping.png',
                        value:4
                    },{
                        text:'退换货',
                        src:'../images/icon_tuihuan.png',
                        value:5
                    },{
                        text:'全部订单',
                        src:'../images/icon_all.png',
                        value:0
                    }]
                };
            },
            created() {
                
            },
            mounted() {
                this.gMI()
                this.getHistoryList()
                this.mOL()
                this.getUserByToken()
                this.findMemberLevel()
            },
            methods: {
                detail(id){
                    window.location.href='../product/product_detail.html?id='+id
                },
                // 跳转订单
                center(vaule){
                    window.location.href='person_center.html?index='+vaule
                },
                // 会员
                findMemberLevel(){
                    axios({
                        method:"POST",
                        url:base_url + "/logMoneys/findMemberLevel",
                        data:Qs.stringify({
                        }),
                        headers:{
                            'Content-Type':'application/x-www-form-urlencoded',
                            "TOKEN":localStorage.getItem('wACCESS_TOKEN')
                        }
                    })
                    .then(function (res) {
                        app.object = res.data.data.object
                    })
                    .catch(function (error) {
                        console.log(error);
                    });
                    
                },
                getUserByToken(){
                    axios({
                        method:"POST",
                        url:base_url + "/user/getUserByToken",
                        data:Qs.stringify({
                        }),
                        headers:{
                            'Content-Type':'application/x-www-form-urlencoded',
                            "TOKEN":localStorage.getItem('wACCESS_TOKEN')
                        }
                    })
                    .then(function (res) {
                        app.info = res.data.data.info
                        console.log(app.info)
                    })
                    .catch(function (error) {
                        console.log(error);
                    });
                },

                handleCurrentChange(index){
                    console.log(index)
                },
                mOL(){
                    axios({
                        method:"POST",
                        url:base_url + "/uo/mOL",
                        data:Qs.stringify({
                        }),
                        headers:{
                            'Content-Type':'application/x-www-form-urlencoded',
                            "TOKEN":localStorage.getItem('wACCESS_TOKEN')
                        }
                    })
                    .then(function (res) {
                        app.info_list = res.data.data.info.list
                        console.log(app.info_list)
                    })
                    .catch(function (error) {
                        console.log(error);
                    });
                    
                },
                // 浏览足迹
                getHistoryList(){
                    axios({
                        method:"POST",
                        url:base_url + "/web/mdse/getHistoryList",
                        data:Qs.stringify({
                        }),
                        headers:{
                            'Content-Type':'application/x-www-form-urlencoded',
                            "TOKEN":localStorage.getItem('wACCESS_TOKEN')
                        }
                    })
                    .then(function (res) {
                        app.spuList = res.data.data.spuList.slice(0,8)
                        console.log(app.spuList)
                    })
                    .catch(function (error) {
                        console.log(error);
                    });
                    
                },
                // 获取用户积分
                gMI(){
                    axios({
                        method:"POST",
                        url:base_url + "/user/gMI",
                        data:Qs.stringify({
                        }),
                        headers:{
                            'Content-Type':'application/x-www-form-urlencoded',
                            "TOKEN":localStorage.getItem('wACCESS_TOKEN')
                        }
                    })
                    .then(function (res) {
                        app.integral = res.data.data.integral
                    })
                    .catch(function (error) {
                        console.log(error);
                    });
                    
                },
                // 显示购物车               
                go_shop_car(){                     
                    window.location.href='../product/shop_car.html'  
                },
                car_box(){
                    this.car_active = !this.car_active
                },
                person_center(){
                    window.location.href='person_center.html?index='+0
                },
                person_address(){
                    window.location.href='person_address.html'
                },
                person_exchange_page(){
                    window.location.href='person_exchange_page.html'
                },
                person_integral(){
                    window.location.href='person_integral_order.html'
                },
                person_collection(){
                    window.location.href='person_collection.html'
                },
                person_foot(){
                    window.location.href='person_footprint.html'
                },
                person_info(){
                    window.location.href='person_info.html'
                },
                person_message(){
                    window.location.href='person_message.html'
                },
                person_ticket(){
                    window.location.href='person_ticket.html'
                },
                product_detail(){
                    window.location.href='../product/product_detail.html'
                },
                person_index(){
                    window.location.href='person_index.html'
                }
            }
        })
        
    </script>
</body>

</html>